<!DOCTYPE HTML>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">

<head>
    <title>Home</title>
    <!-- Meta tag Keywords -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8"/>
    <meta name="keywords" content=""
    />

    <script>
        addEventListener("load", function () {
            setTimeout(hideURLbar, 0);
        }, false);

        function hideURLbar() {
            window.scrollTo(0, 1);
        }
    </script>
    <!-- Meta tag Keywords -->
    <!-- css files -->
    <!--    <link rel="stylesheet" href="../static/assets/css/style.css" type="text/css" media="all"/>-->
    <link rel="stylesheet" th:href="@{/assets/css/style.css}" type="text/css" media="all"/>
    <!-- Style-CSS -->
    <link rel="stylesheet" href="https://www.jq22.com/jquery/font-awesome.4.7.0.css">

    <!-- Font-Awesome-Icons-CSS -->
    <!-- //css files -->
    <!-- web-fonts -->

    <!-- //web-fonts -->
</head>

<body>
<!-- bg effect -->
<div id="bg">
    <canvas></canvas>
    <canvas></canvas>
    <canvas></canvas>
</div>
<!-- //bg effect -->
<!-- title -->
<h1>欢迎</h1>
<!-- //title -->
<!-- content -->
<div class="sub-main-w3">
    <!--同步-->
    <!--    <form th:action="@{/user/login}" method="post">-->
    <!--异步-->
    <form action="#" method="post">
        <h2>Login Now
            <i class="fa fa-long-arrow-down"></i>
        </h2>
<!--        <br>-->
<!--        <span id="loginHint" style="color: red;font-weight: bolder;"></span>-->
        <div class="form-style-agile">
            <label>
                <i class="fa fa-user"></i>
                用户名
            </label>
            <input placeholder="Username" name="username" id="username" type="text" value="admin" required="">
        </div>
        <div class="form-style-agile">
            <label>
                <i class="fa fa-unlock-alt"></i>
                密码
            </label>
            <input placeholder="Password" name="password" id="password" type="password" required="">
        </div>
        <!-- checkbox -->
        <div class="wthree-text">
            <ul>
                <li>
                    <label class="anim">
                        <input type="checkbox" class="checkbox" required="">
                        <span>记住登陆</span>
                    </label>
                </li>
                <li>
                    <a href="#">忘记密码?</a>
                </li>
            </ul>
        </div>
        <!-- //checkbox -->
        <!--同步-->
        <!--        <input type="submit" value="登陆">-->
        <!--异步-->
        <input type="button" id="loginBtn" value="登陆">

    </form>
</div>
<!-- //content -->

<!-- copyright -->
<div class="footer">
    <p>Copyright &copy; 2018.Company name All rights reserved.</p>
</div>
<!-- //copyright -->

<!-- Jquery -->
<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<!-- //Jquery -->

<!-- effect js -->
<!--<script src="../static/assets/js/canva_moving_effect.js"></script>-->
<script th:src="@{/assets/js/canva_moving_effect.js}"></script>
<script th:src="@{/assets/js/layer/layer.js}"></script>
<script th:src="@{/assets/js/myscript.js}"></script>
<!-- //effect js -->

</body>

</html>